html,
body {
  width: 100%;
  height: 100%;
  min-width: 1344px;
}
body {
  font-size: 14px;
  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
}
// table 布局
.yb-table {
  display: table !important;
}
.yb-table-cell {
  display: table-cell !important;
  vertical-align: middle !important;
}

/* 版心 */
.yb-Layout-w {
  width: 1344px;
  height: 100%;
  margin: 0 auto;
  position: relative;
}

.full-layout {
  position: absolute;
  width: 100%;
  min-height: 100%;
  min-width: 1400px;
  padding: 8px 28px 24px;
  background-color: $baseModuleBackgroundColor;
}

span,
a,
i,
em,
img {
  display: inline-block;
}

a {
  text-decoration: none;
}

// 清除浮动
.clearfloat {
  &::after {
    display: block;
    clear: both;
    content: "";
    visibility: hidden;
    height: 0;
  }
  zoom: 1;
}

// padding
.padding {
  &-left {
    &-4 {
      padding-left: 4px;
    }
    &-8 {
      padding-left: 8px;
    }
    &-22 {
      padding-left: 22px;
    }
    &-24 {
      padding-left: 24px;
    }
    &-64 {
      padding-left: 64px;
    }
  }
  &-right {
    &-24 {
      padding-right: 24px;
    }
  }
  &-top {
    &-16 {
      padding-top: 16px;
    }
    &-24 {
      padding-top: 22px;
    }
    &-32 {
      padding-top: 32px;
    }
    &-48 {
      padding-top: 48px;
    }
  }
  &-bottom {
    &-24 {
      padding-bottom: 24px;
    }
    &-32 {
      padding-bottom: 32px !important;
    }
  }
}
// margin
.margin {
  &-top {
    &-20 {
      margin-top: 20px;
    }
    &-24 {
      margin-top: 24px;
    }
  }
  &-bottom {
    &-24 {
      margin-bottom: 24px;
    }
    &-40 {
      margin-bottom: 40px;
    }
    &-64 {
      margin-bottom: 64px;
    }
    &-80 {
      margin-bottom: 80px;
    }
  }
  &-left {
    &-12 {
      margin-left: 12px;
    }
    &-32 {
      margin-left: 32px;
    }
  }
  &-right {
    &-8 {
      margin-right: 8px;
    }
  }
}
// input
.ant-input {
  width: 280px;
  &.w-224 {
    width: 224px;
  }
  &.w-300 {
    width: 300px;
  }
}

.ant-input-disabled {
  color: #666666;
}

// img
.yb-img-thumbnail {
  float: left;
  width: 168px;
  height: 168px;
  margin-top: 16px;
  background: #f5f5f5;
  border-radius: 4px;
  border: 1px dashed rgba(204, 204, 204, 1);
  background-image: url("./assets/default-avatar.svg");
  background-repeat: no-repeat;
  background-position: center;
  img {
    width: 166px;
    height: 166px;
  }
}

// link
.a-link {
  color: #4a7ae0;
  cursor: pointer;
  &:hover {
    color: #4a7ae0;
  }
}

// table
.yb-table-box {
  .ant-table-thead > tr > th,
  .ant-table-tbody > tr > td {
    padding: 14px 20px;
    position: relative;
  }
}

.yb-table-box-line40 {
  .ant-table-thead > tr > th,
  .ant-table-tbody > tr > td {
    padding: 8px 20px;
    position: relative;
  }
}

.yb-table-small {
  .ant-table-thead > tr > th,
  .ant-table-tbody > tr > td {
    padding: 12px;
  }
}

// menu-module
.menu-module {
  height: 46px;
  position: relative;
  background-color: $baseModuleBackgroundColor;
}

// tabs
.yb-tabs-box {
  position: relative;
  font-size: 14px;
  box-sizing: border-box;
  .yb-tabs-bar {
    position: relative;
    border-bottom: 1px solid #E5E5E5;
    margin-bottom: 16px;
    .yb-tabs-tab {
      cursor: pointer;
      position: relative;
      text-align: center;
      width: 136px;
      margin: 0;
      border: 1px solid #e8e8e8;
      border-bottom: 0;
      border-radius: 4px 4px 0 0;
      background: #fafafa;
      margin-right: 8px;
      padding: 0 16px;
      -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
      transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
      line-height: 38px;
      &:hover {
        color: #4b79e0;
      }
      &.yb-tabs-tab-active {
        background-color: #fff;
        border-color: #e8e8e8;
        color: #4b79e0;
        font-weight: bold;
        &::after {
          display: block;
          content: "";
          position: absolute;
          width: 100%;
          height: 2px;
          top: 38px;
          left: 0px;
          background-color: #fff;
        }
      }
    }
  }
}
.yb-tabs {
  .ant-tabs-bar {
    margin: 0 auto;
    border: none;
    .ant-tabs-tab {
      font-size: 16px;
      padding: 12px 24px;
      &.ant-tabs-tab-active {
        color: #1e47a0;
      }
    }
    .ant-tabs-nav .ant-tabs-tab:hover {
      color: #1e47a0;
    }
    .ant-tabs-ink-bar {
      background-color: #1e47a0;
      height: 3px;
    }
  }
}

.yb-tabs-small {
  .ant-tabs-bar {
    margin: 0 auto;
    border-bottom: 1px solid #EDEDED;
    .ant-tabs-tab {
      font-size: 12px;
      padding: 12px 12px;
      margin: 0;
      .ant-tabs-ink-bar {
        height: 3px;
      }
    }
  }
}

// menu vertical
.yb-menu-v {
  padding: 0;
  .ant-dropdown-menu-item {
    line-height: 30px;
    &.is-active {
      color: #1e47a0;
      font-weight: bold;
    }
  }
}

// modal
.yb-modal {
  .ant-btn.ant-btn-default {
    display: none;
  }
}

// message
.ant-message {
  text-align: center;
}

// tooltip
.yb-tooltip {
  .ant-tooltip-inner {
    line-height: 24px;
    padding: 8px 10px;
  }
}

// ant-form
.yb-form {
  .ant-form-item {
    width: 428px;
    margin-bottom: 16px;
    .ant-form-item-label {
      text-align: right;
    }
  }
  .yb-form-item {
    width: auto;
    &.fixed-width {
      .ant-form-item-label {
        width: 89px;
      }
      .ant-form-item-control-wrapper {
        width: 380px;
      }
    }
  }
  &.w-600 {
    .ant-form-item {
      width: 600px;
    }
  }
}

.home-form {
  .ant-input {
    width: 330px;
    &.verification {
      width: 250px;
    }
  }
  .ant-form-item {
    margin-bottom: 24px;
  }
  .ant-form-item-label {
    padding-bottom: 14px;
  }
}
.yb-form-fixed-item-label {
  .ant-form-item {
    margin-right: 40px;
    .ant-form-item-label {
      width: 64px;
    }
  }
  &-110 {
    .ant-form-item-label {
      width: 110px;
    }
  }
  .label-80 {
    .ant-form-item-label {
      width: 80px;
    }
  }
}

.ant-form-explain {
  position: absolute;
  height: 16px;
  line-height: 16px;
}
.ant-form-item {
  margin-bottom: 16px;
}

// checkbox-group
.yb-checkbox-group {
  &.ant-checkbox-group {
    width: 100%;
    .ant-checkbox-group-item {
      margin-right: 24px;
    }
    .ant-checkbox-wrapper {
      padding-top: 16px;
    }
  }
}

// breadcrumb
.yb-breadcrumb {
  height: 22px;
  .yb-breadcrumb-link {
    color: #666666;
    cursor: pointer;
    &:hover {
      color: #4b79e0;
    }
  }
  .ant-breadcrumb-link {
    color: #999999;
  }
}
// select
.yb-select {
  &-s {
    width: 132px !important;
  }
  &-b {
    width: 224px !important;
  }
  &-280 {
    width: 280px !important;
  }
}
[class*="yb-select"] + [class*="yb-select"] {
  margin-left: 16px;
}

// range-picker
.yb-range-picker {
  width: 224px;
  .ant-calendar-picker-input {
    width: 224px;
  }
}

.ant-form-inline .ant-form-item > .ant-form-item-control-wrapper,
.ant-form-inline .ant-form-item > .ant-form-item-label {
  vertical-align: top;
}

// 分页
.ant-pagination-jump-next,
.ant-pagination-jump-prev {
  a {
    display: inline !important;
  }
}

// 加载
.yb-spin {
  &.ant-spin {
    .ant-spin-dot {
      i {
        background-color: #dbd24d;
      }
    }
  }
}
